var isAnimating = false;
var oldScroll = 0;
var hasScrolled = false;
$(window).on('wheel', function(event) {
    // 如果正在进行动画，或者滚轮向上滚动，就不处理滚轮事件
    if (isAnimating) {
        return;
    }
    var windowHeight = $(window).height();
    var scrollAmount = $(window).scrollTop();
    var containerTop = $('.container').offset().top;
    var centerTop = $('.center-main').offset().top;
    var imgGroup1Top = $('#img-group-1').offset().top;
    var imgGroup2Top = $('#img-group-2').offset().top;
    var imgGroup3Top = $('#img-group-3').offset().top;
    var imgGroup4Top = $('#img-group-4').offset().top;

    var containerBottom = containerTop + $('.container').outerHeight();

    // 如果 .container div 在视窗中
    if (scrollAmount + windowHeight > containerTop && scrollAmount < containerBottom && event.originalEvent.deltaY > 0) {
        if (oldScroll < 0 && event.originalEvent.deltaY < 0 || oldScroll > 0 && event.originalEvent.deltaY > 0) {
            console.log('滚轮方向相同，不处理');
            return;
        }
        event.preventDefault(); // 阻止默认滚动行为
        isAnimating = true; // 开始动画
        // 滚动到 .center-main div
        $('html, body').animate({
            scrollTop: $('.center-main').offset().top - 40
        }, 300, function() {
            isAnimating = false; // 结束动画
        });
        oldScroll = event.originalEvent.deltaY;
        $('#title-1').addClass('fade-animate'); // 添加 'animate' 类来触发动画
        $('#intro').addClass('down-animate'); // 添加 'animate' 类来触发动画
        $('.group1-img').addClass('filter-animate');
        $('#group2-title').removeClass('left-animate');
        $('#group2-imgs').removeClass('right-animate');
        $('#group3-title').removeClass('left-animate');
        $('#group3-imgs').removeClass('right-animate');
        $('#group4-title').removeClass('left-animate');
        $('#group4-imgs').removeClass('right-animate');

    }

    // 如果 .container div 在视窗中
    if (scrollAmount + windowHeight > centerTop && scrollAmount < centerTop && event.originalEvent.deltaY < 0) {
        if (oldScroll < 0 && event.originalEvent.deltaY < 0 || oldScroll > 0 && event.originalEvent.deltaY > 0) {
            console.log('滚轮方向相同，不处理');
            return;
        }
        event.preventDefault(); // 阻止默认滚动行为

        isAnimating = true; // 开始动画
        // 滚动到 .center-main div
        $('html, body').animate({
            scrollTop: -98
        }, 300, function() {
            isAnimating = false; // 结束动画
        });
        oldScroll = event.originalEvent.deltaY;
        $('#title-1').removeClass('fade-animate'); // 添加 'animate' 类来触发动画
        $('#intro').removeClass('down-animate'); // 添加 'animate' 类来触发动画
        $('.group1-img').removeClass('filter-animate');
    }

    if (scrollAmount + windowHeight > imgGroup2Top && scrollAmount < imgGroup2Top) {
        event.preventDefault(); // 阻止默认滚动行为
        // 防抖处理
        $('#group2-title').addClass('left-animate');
        $('#group2-imgs').addClass('right-animate');
        oldScroll = event.originalEvent.deltaY;
    }

    if (scrollAmount + windowHeight > imgGroup3Top && scrollAmount < imgGroup3Top) {
        event.preventDefault(); // 阻止默认滚动行为
        // 防抖处理
        $('#group3-title').addClass('left-animate');
        $('#group3-imgs').addClass('right-animate');
        oldScroll = event.originalEvent.deltaY;
    }

    if (scrollAmount + windowHeight > imgGroup4Top && scrollAmount < imgGroup4Top) {
        event.preventDefault(); // 阻止默认滚动行为
        // 防抖处理
        $('#group4-title').addClass('left-animate');
        $('#group4-imgs').addClass('right-animate');
        oldScroll = event.originalEvent.deltaY;
    }
    
     
    
});
